<!-- itemList.html 2018-07-05 14:09:40-->
#@HplusLayout()
#define cssStyle()
<link href="#(res_path)/hplus/css/plugins/ztree/metroStyle/metroStyle.css" rel="stylesheet">
#end
#define content()
<div class="gray-bg" style="padding:0 10px;height: 100%">
	<div class="row">
		<div class="col-xs-5">		
			<div class="ibox">
				<div class="ibox-title">
					<h5>菜单项目录</h5>
					<div class="pull-right">
						<a href="javascript:" style="font-size:12px;color: red" onclick="add(0);">新增根菜单</a>&nbsp;&nbsp;
						<a href="javascript:" style="font-size:12px;color: red" onclick="post();">正式发布</a>
					</div>
				</div>
				<div class="ibox-content">
					<ul id="ZTree" class="ztree"></ul>
				</div>
			</div>	
		</div>
		<div class="col-xs-7" id="addEdit">
			<div class="ibox">
				<div class="ibox-title">
					<h5>菜单项编辑</h5>
				</div>
				<div class="ibox-content">
					<div style="text-align: center;line-height: 50px">
						<i class="glyphicon glyphicon-repeat"></i> 点击左侧树形菜单或新增按钮
					</div>
				</div>
			</div>
		</div>
	</div>
</div>
#end
#define js()
<script src="#(res_path)/hplus/js/plugins/validate/jquery.validate.min.js"></script>
<script src="#(res_path)/hplus/js/plugins/validate/messages_zh.min.js"></script>
<script src="#(res_path)/hplus/js/plugins/ztree/jquery.ztree.all.min.js"></script>
#end
#define jsFunction()
<script>
	var zNodes = #(listJSON??"[]");
	$(function(){
		$.fn.zTree.init($("#ZTree"), {data: {simpleData: {enable: true}},callback:{onClick:treeOnClick}}, zNodes);
	});
	function post(){
		$.ajax({
			url:"#(path)/portal/weixin/menu/postItem?group_id=#(group_id)",
			dataType:"json",
			success:function(data){
				if(data.result=="success"){
					layer.alert(data.message,{icon:1});
				}else {
					layer.alert(data.message,{icon:2});
				}
			},error:function(){
				layer.alert("与服务器通讯失败！",{icon:2});
			}
		})
	}
	function add(id){
		$("#addEdit").loadUrl("addEditItem?group_id=#(group_id)&parent_id="+id,{},function(){
			initUI(document.getElementById("addEdit"));
		});
	}
	function thisAjaxDone(json){
		hplus.ajaxDone(json);
		if(json.result=="success"){
			var treeObj = $.fn.zTree.getZTreeObj("ZTree");
			var node = treeObj.getNodeByParam("id", json.object.id, null);
			if(node){
				node.name = json.object.name;
				treeObj.updateNode(node);
			}else {
				var newNode = {id:json.object.id, pId:json.object.parent_id, name:json.object.name};
				var parent = null;
				if(json.object.parent_id!=null){
					parent = treeObj.getNodeByParam("id", json.object.parent_id, null);
				}
				treeObj.addNodes(parent, newNode);
			}
			$("#addEdit").loadUrl("addEditItem",{id:json.object.id},function(){
				initUI(document.getElementById("addEdit")); 
			});
		}
	}
	function deleteAjaxTodo(json){
		hplus.ajaxDone(json);
		if(json.result=="success"){
			var treeObj = $.fn.zTree.getZTreeObj("ZTree");
			var node = treeObj.getNodeByParam("id", json.id, null);
			treeObj.removeNode(node);
			closeEdit();
		}
	}
	var addEditHtml = $("#addEdit").html();
	function closeEdit(){
		$("#addEdit").html(addEditHtml);
	}
  function treeOnClick(event, treeId, treeNode){
		$("#addEdit").loadUrl("addEditItem",{id:treeNode.id},function(){
			initUI(document.getElementById("addEdit"));
		});
  }
	function expandAll(flag){
		var treeObj = $.fn.zTree.getZTreeObj("ZTree");
		treeObj.expandAll(flag);
	}
 </script>
#end